<template>
  <!-- 开题报告 -->
  <div>
    <!-- 标题区域 -->
    <div class="title">
      <el-descriptions :column="3" border>
        <el-descriptions-item label="我的毕业设计课题">
          <router-link to="/mytopic">{{ topic }}</router-link>
        </el-descriptions-item>
        <el-descriptions-item label="指导老师">
          <router-link
            :to="{ path: '/teacherinfo', query: { id: teacher_id } }"
            >{{ teacher }}</router-link
          >
        </el-descriptions-item>
      </el-descriptions>
    </div>

    <div class="content">
      <el-descriptions :column="3" border>
        <el-descriptions-item>
          <template slot="label"> 开题报告结束时间： </template>
          无
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label"> 我的开题报告： </template>
          <!-- 上传区域 -->
          <el-upload
            :headers="header"
            :on-success="onsuccess"
            name="file"
            action="http://127.0.0.1:8080/my/add"
          >
            <el-button size="small" type="primary">点击上传</el-button>
          </el-upload>
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label"> 开题报告： </template>
          <a href="javascript:;" @click="download()">{{
            report.report_name
          }}</a>
        </el-descriptions-item>
        <!-- 教师意见 -->
        <el-descriptions-item>
          <template slot="label"> 指导教师审核意见： </template>
          <p>{{ report.teacher_idea }}</p>
        </el-descriptions-item>

        <!-- 开题答辩审核意见： -->
        <el-descriptions-item>
          <template slot="label"> 开题答辩审核意见： </template>
          小组组长：{{ report.replyTeacher_name }}
          <!-- {{ report.reply_date | formatData }} -->
          <br />
          小组意见：{{ report.reply_idea }}
        </el-descriptions-item>
      </el-descriptions>
    </div>
  </div>
</template>
<script>
export default {
  created() {
    this.getTask();
    this.get_report();
  },
  data() {
    return {
      teacher_id: "",
      teacher: "",
      topic: "",
      header: {
        authorization: window.sessionStorage.token,
      },
      report: {},
    };
  },
  filters: {
    formatData(time, arg) {
      return new Date(time).toLocaleString();
    },
  },
  methods: {
    getTask() {
      this.$http.get("http://127.0.0.1:8080/my/getTopic").then((res) => {
        // console.log(res.data.data);
        // console.log(res.data.data[1][0].topic_name);
        // console.log(this.topic);
        if (res.data.status == 0) {
          this.topic = res.data.data[1][0].topic_name;
          this.teacher = res.data.data[0][0].teacher_name;
          this.teacher_id = res.data.data[0][0].id;
        } else {
          (this.topic = ""), (this.teacher = "");
        }
      });
    },
    get_report() {
      this.$http.get("http://127.0.0.1:8080/my/get_report").then((res) => {
        console.log(res);
        if (res.data.status == 0) {
          this.report = res.data.data[0];
        } else {
          this.report = {};
        }
        // console.log(this.report);
      });
    },
    onsuccess() {
      this.get_report();
    },
    download() {
      // console.log(this.report.id);
      location.href = "http://127.0.0.1:8080/api/download?id=" + this.report.id;
    },
  },
};
</script>
<style lang="less" scoped>
.content {
  margin: 20px 0;
}
</style>
